@charset "UTF-8";
* {
  margin: 0;
  padding: 0;
}

.content {
  width: 800px;
  height: 100px;
  margin: 100px auto;
  border: 1px solid;
}

.content .y-btn {
  /*默认*/
  width: 80px;
  height: 50px;
  margin-left: 20px;
  margin-top: 25px;
  border: 1px solid beige;
  border-radius: 5px;
  color: blank;
  background-color: white;
}

.content .y-btn:hover {
  background-color: #f5fbfb;
}

.content .y-btn-primary {
  /*主要*/
  width: 80px;
  height: 50px;
  margin-left: 20px;
  margin-top: 25px;
  border: 1px solid beige;
  border-radius: 5px;
  color: white;
  background-color: #1777e6;
}

.content .y-btn-primary:hover {
  background-color: #5432ee;
}

.content .y-btn-success {
  /*成功*/
  width: 80px;
  height: 50px;
  margin-left: 20px;
  margin-top: 25px;
  border: 1px solid beige;
  border-radius: 5px;
  color: white;
  background-color: #37f150;
}

.content .y-btn-success:hover {
  background-color: #2cec0b;
}

.content .y-btn-warning {
  /*警告*/
  width: 80px;
  height: 50px;
  margin-left: 20px;
  margin-top: 25px;
  border: 1px solid beige;
  border-radius: 5px;
  color: white;
  background-color: #f0d044;
}

.content .y-btn-warning:hover {
  background-color: #ece810;
}

.content .y-btn-danger {
  /*危险*/
  width: 80px;
  height: 50px;
  margin-left: 20px;
  margin-top: 25px;
  border: 1px solid beige;
  border-radius: 5px;
  color: white;
  background-color: #4becec;
}

.content .y-btn-danger:hover {
  background-color: #07f8ec;
}
